import 'package:animated_toggle_switch/animated_toggle_switch.dart';
import 'package:flutter/material.dart';
import 'package:framelib/utils/px_util.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

typedef CommSwitchCall = void Function(bool b);
class CommSwitch extends StatefulWidget {
  bool? defaultValue;
  bool? disable;
  String? activeTitle;
  String? inActiveTitle;
  TextStyle? activeTitleStyle;
  TextStyle? inActiveTitleStyle;
  double? spaceWidth;
  CommSwitchCall? switchCall;
  bool? boxShadowShow;
  List<BoxShadow>? boxShadow;
  CommSwitch({
      super.key,this.switchCall,this.boxShadowShow,this.boxShadow,
      this.defaultValue,this.disable,
      this.activeTitle,this.inActiveTitle,
      this.activeTitleStyle,this.inActiveTitleStyle,this.spaceWidth,
    });

  @override
  State<CommSwitch> createState() => _CommSwitchState();
}

class _CommSwitchState extends State<CommSwitch> {
  bool current = false;

  var leftColor = Color(0xFFcccccc);
  var rightColor = Color(0xff1BD9D9);
  var rightColor1 = Color(0xffe1e1e1);
  var borderWidth = px_2;
  var height = px_18;
  var innerIndicatorSize = px_18;

  @override
  void initState() {
    current = widget.defaultValue??true;
    innerIndicatorSize = height - 4 * borderWidth;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    leftColor = (widget.disable??false)?Color(0xffe1e1e1):Color(0xFFcccccc);
    rightColor = (widget.disable??false)?Color(0xff70d2d2):Color(0xff1BD9D9);
    return Row(
      children: [
        (widget.inActiveTitle??'').isEmpty?SizedBox(width: px_0.w,):
        Text(
          widget.inActiveTitle??'',
          style: widget.inActiveTitleStyle??
              TextStyle(
                fontSize: px_14.sp,
                color: (widget.disable??false)?Color(0xff999999):Color(0xff383838)
          ),
        ),
        (widget.inActiveTitle??'').isEmpty?SizedBox(width: px_0.w,):
        SizedBox(width: (widget.spaceWidth)??(px_5.w),),
        CustomAnimatedToggleSwitch(
          current: current,
          spacing: 0.0,
          values: const [false, true],
          animationDuration: const Duration(milliseconds: 350),
          animationCurve: Curves.bounceOut,
          // animationCurve: Curves.linearToEaseOut,
          iconBuilder: (context, local, global) => const SizedBox(),
          onTap: (_){
            if((widget.disable??false))return;
            setState(() => current = !current);
            if(widget.switchCall!=null)widget.switchCall!(current);
          },
          iconsTappable: false,
          onChanged: (b){
            if((widget.disable??false))return;
            setState(() => current = b);
          },
          height: height,
          padding: EdgeInsets.all(borderWidth.sp),
          indicatorSize:  Size.square((height - 2 * borderWidth).sp),
          foregroundIndicatorBuilder: (context, global) {
            final color = Color.lerp(leftColor, rightColor, global.position)!;
            return
              Container(
                alignment: Alignment.center,
                decoration: const BoxDecoration(color: Colors.white, shape: BoxShape.circle),
                child: Container(
                  // width: (innerIndicatorSize * 0.4 + global.position * innerIndicatorSize * 0.6).w,
                    width: innerIndicatorSize.h,
                    height: innerIndicatorSize.h,
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(innerIndicatorSize.h/2),
                      color: color,
                    )
                ),
              );
          },

          wrapperBuilder: (context, global, child) {
            final color = Color.lerp(leftColor, rightColor, global.position)!;
            return DecoratedBox(
              decoration: BoxDecoration(
                color: color,
                borderRadius: BorderRadius.circular(px_50.sp),
                boxShadow: !(widget.boxShadowShow??false)?null:
                widget.boxShadow??
                    [
                      BoxShadow(
                        color: color.withOpacity(0.7),
                        blurRadius: px_12.sp,
                        offset: Offset(0.0, px_8.h),
                      ),
                    ],
              ),
              child: child,
            );
          },
        ),
        (widget.activeTitle??'').isEmpty?SizedBox(width: px_0.w,):
        SizedBox(width: (widget.spaceWidth)??(px_5.w),),
        (widget.activeTitle??'').isEmpty?SizedBox(width: px_0.w,):
        Text(
          widget.activeTitle??'',
          style: widget.activeTitleStyle??
              TextStyle(
                fontSize: px_14.sp,
                color: (widget.disable??false)?Color(0xff999999):Color(0xff383838)
          ),
        ),
      ],
    );
  }
}
